<!-- 新增/编辑 组织机构 -->
<template>
  <a-modal v-model:visible="visible" :width="'90vw'" title="修改费用" unmount-on-close>
    <!-- 分期的 -->
    <EditFeeStages v-if="isStages" :id="feeId" ref="editFee" />
    <EditFee v-else :id="feeId" ref="editFee" />

    <template #footer>
      <a-space>
        <a-button @click="close">关闭</a-button>
        <a-button type="primary" @click="onConfirm" :loading="okLoading">确认</a-button>
      </a-space>
    </template>
  </a-modal>
</template>

<script setup>
  import { ref } from 'vue'
  import EditFee from './edit-fee.vue'
  import EditFeeStages from './edit-fee-stages.vue'
  import { Notification } from '@arco-design/web-vue'

  const emits = defineEmits(['ok'])
  const visible = ref(false)

  const close = () => {
    visible.value = false
  }

  // paymentWay 用于区分是否为分期账单
  const isStages = ref(true)
  const feeId = ref()
  const open = (paymentWay, id) => {
    if (!paymentWay || (paymentWay && paymentWay == 1)) {
      isStages.value = false
    } else {
      isStages.value = true
    }
    feeId.value = id
    visible.value = true
    okLoading.value = false
  }

  const okLoading = ref(false)
  const editFee = ref()
  const onConfirm = async () => {
    okLoading.value = true
    const res_code = await editFee.value.submitFn()
    console.log('🐳 > onConfirm > res_code:', res_code)
    okLoading.value = false
    if (res_code == 200) {
      Notification.success({
        content: '保存成功',
        closable: true,
        duration: 3000,
      })
      emits('ok')
      close()
    }
  }
  defineExpose({
    open,
  })
</script>

<style lang="less" scoped></style>
